export default {
  name: 'LoopComponent',
  props: {
    list: {
      type: Array,
      default: () => {
        return []
      }
    }
  },
  methods: {
    // 主要通过接收子组件参数
    loopH(h, list) {
      return h(
        'div',
        {
          attrs: {
            class: 'list-item'
          },
          // 继续向下传递参数 
          props: {
            list: list
          }
        },
        [
          h('div', {
            attrs: {
              class: 'item-name'
            }
          }, [
            h('span', list.name)
          ]),
          (() => {
            if (!list.children || !list.children.length) return []
            return list.children.map((item) => {
                return this.loopH(h, item)
            })
          })()
        ]
      )
    }
  },
  mounted() {
  },
  render(h) {
    return this.loopH(h, this.list[0])
  }
}